<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('规则要素测试')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-items">
        <div th:if="${not #lists.isEmpty(detailList)}" th:each="detail, item:${detailList}">
            <div class="col-sm-6">
                <!--判断是否为枚举，区分下拉框-->
                <div class="form-group" th:if="${detail.isEnum}=='F'">
                    <label class="col-sm-4 control-label  is-required"><span th:id="'span'+${item.index}">[[${detail.elementsName}]]</span>：</label>
                    <!--判断是要素项类型 1-数字型 2-字符型-->
                    <div th:if="${detail.elementsType}=='2'">
                        <div class="col-sm-8" th:if=" ${not #strings.isEmpty(detail.elementsUnit)}">
                            <div class="input-group ">
                                <input name="enumValue" th:id="'input'+${item.index}" class="form-control" required
                                       type="text" maxlength="30">
                                <span class="input-group-addon">[[${detail.elementsUnit}]]</span>
                            </div>
                        </div>
                        <div class="col-sm-8" th:if="${#strings.isEmpty(detail.elementsUnit)}">
                            <input name="enumValue" th:id="'input'+${item.index}" class="form-control" required
                                   type="text" maxlength="30">
                        </div>
                    </div>
                    <div th:if="${detail.elementsType}=='1'">
                        <div class="col-sm-8" th:if=" ${not #strings.isEmpty(detail.elementsUnit)}">
                            <div class="input-group ">
                                <input name="enumValue" th:id="'input'+${item.index}" class="form-control" required
                                       type="number" maxlength="30">
                                <span class="input-group-addon">[[${detail.elementsUnit}]]</span>
                            </div>
                        </div>
                        <div class="col-sm-8" th:if=" ${#strings.isEmpty(detail.elementsUnit)}">
                            <input name="enumValue" th:id="'input'+${item.index}" class="form-control" required
                                   type="number" maxlength="30">
                        </div>
                    </div>
                </div>
                <div class="form-group" th:if="${detail.isEnum}=='T'">
                    <label class="col-sm-4 control-label is-required"><span th:id="'span'+${item.index}">[[${detail.elementsName}]]</span>：</label>
                    <div class="col-sm-8">
                        <select name="enumValue" class="form-control" th:id="'select'+${item.index}"
                                th:with="type=${@dict.getType(detail.enumValue)}" required>
                            <option th:each="dict : ${type}" th:text="${dict.dictLabel}"
                                    th:value="${dict.dictValue}"></option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-12">
            <div class="form-group">
                <label class="col-sm-2 control-label is-required">计算公式：</label>
                <div class="col-sm-10">
                    <textarea name="ruleFormulas"  id="ruleFormulas" class="form-control" style="height: 200px;" required maxlength="500">[[${ruleElementsGroup.ruleFormulas}]]</textarea>
                </div>
            </div>
        </div>
        <div class="col-sm-12">
            <div class="form-group">
                <label class="col-sm-2 control-label"><a class="btn btn-success"
                                                         onclick="performTheTest()">执行测试</a></label>
                <div class="col-sm-10">
                    <textarea id="outcome" class="form-control" readonly></textarea>
                </div>
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    $("#form-items").validate({
        focusCleanup: true
    });

    function performTheTest() {
        var detailList = [[${detailList}]];
        if ($.validate.form()) {
            let emptyArray = [];
            for (let i = 0; i < detailList.length; i++) {
                let jsonString = {};
                jsonString["elementsType"] = detailList[i].elementsType;
                // 获取div元素
                var spanVal = document.getElementById('span' + i).innerHTML;
                jsonString["elementsName"] = spanVal;

                var inputVal = document.getElementById('input' + i);
                if (inputVal != null && inputVal != "" && typeof (inputVal) != "undefined") {
                    console.log(spanVal + ":" + inputVal.value);
                    jsonString["elementsValue"] = inputVal.value;
                }
                var selectVal = document.getElementById('select' + i);
                if (selectVal != null && selectVal != "" && typeof (selectVal) != "undefined") {
                    console.log(spanVal + ":" + selectVal.value);
                    jsonString["elementsValue"] = selectVal.value;
                }
                emptyArray.push(jsonString);
            }
            let ruleFormulas=document.getElementById("ruleFormulas").value;
            let formData = {};
            formData["groupId"] = [[${ruleElementsGroup.id}]];
            formData["ruleFormulas"] = ruleFormulas;
            formData["ruleElementsItems"] = emptyArray;
            $.ajax({
                url: ctx + "rule/group/performTheTest",
                data: JSON.stringify(formData),
                async: false,
                type: "post",
                contentType: "application/json;charset=utf-8",
                success: function (result) {
                    if (result.code == 0) {
                        document.getElementById('outcome').value = result.data;
                    } else {
                        $.modal.alert(result.msg);
                    }
                }
            });

        }
    }

    /**
     * 是否枚举事件
     */
    function enumerationOrNot(val) {
        if (val == "T") {
            document.getElementById("ev-div").style.display = "";
            document.getElementById("en-div").style.display = "";
        } else {
            document.getElementById("ev-div").style.display = "none";
            document.getElementById("en-div").style.display = "none";
        }
    }


    // 选择字典处理函数
    function selectDictTree() {
        var dictType = "-";
        var url = ctx + "system/dict/selectDictTree/1/" + dictType;
        var options = {
            title: '选择字典类型',
            width: "380",
            url: url,
            callBack: doDictSubmit
        };
        $.modal.openOptions(options);
    }

    function doDictSubmit(index, layero) {
        var body = $.modal.getChildFrame(index);
        var dictType = body.find('#dictType').val();
        var dictName = body.find('#dictName').val();
        $.modal.close(index);
        $('#enumValue').val(dictType);
        $('#enumName').val(dictName);
    }
</script>
</body>
</html>